// FILTER USERS
// ===============================================

$(".user-search input[name='search']").change(function() {
	filterUsers($(this).val());
	return false;
}).keyup(function() {
	$(this).change();
});

// add basic functionality
// ===============================================

$(".modal-left .non-invited .user").click(function() {
	addUser($(this));
});
$(".modal-right .invited .user").click(function() {
	delUser($(this));
});

// ====================================================================================
// methods
// ====================================================================================

// get selected users
// ===============================================

function selected() {
	alert($("#modal-compare .modal-main .invited"));
}

// add users
// ===============================================

function addUser(user) {

	var id = user.data("user");
	var imagen = user.find("img").attr("src");
	var nombre = user.find(".name").text();

	user.remove();

	var li = $('<span>').attr({
		"class" : "user",
		"data-user" : id
	}).click(function() {
		delUser($(this));
	});
	var icon = $('<span>').attr("class", "glyphicon glyphicon-remove");
	var img = $('<img>').attr("src", imagen);
	var name = $('<span>').attr("class", "name").text(nombre);

	icon.appendTo(li);
	img.appendTo(li);
	name.appendTo(li);

	li.insertBefore(".modal-right .invited .end");

}

// delete USUARIOS
// ===============================================

function delUser(user) {

	var id = user.data("user");
	var image = user.find("img").attr("src");
	var name = user.find(".name").text();

	user.remove();

	var li = $('<span>').attr({
		"class" : "user",
		"data-user" : id
	}).click(function() {
		addUser($(this));
	});

	var icon = $('<span>').attr("class", "glyphicon glyphicon-plus");
	var img = $('<img>').attr("src", image);
	var name = $('<span>').attr("class", "name").text(name);

	icon.appendTo(li);
	img.appendTo(li);
	name.appendTo(li);

	li.insertBefore(".modal-left .non-invited .end");
}

// filter users
// ===============================================

jQuery.expr[':'].Contains = function(a, i, m) {
	return (a.textContent || a.innerText || "").toUpperCase().indexOf(
			m[3].toUpperCase()) >= 0;
};

function filterUsers(name) {
	var lista = $(".modal-left .non-invited");

	if (name) {
		lista.find(".name:not(:Contains(" + name + "))").closest(".user")
				.hide();
		lista.find(".name:Contains(" + name + ")").closest(".user").show();
	} else {
		lista.find(".user").show();
	}
}

// Location
$(document).ready(function() {
	$("#event-location").change(updateCity);
	updateCity ();
});

function updateCity () {		
	$.ajax({
		url : "http://api.openweathermap.org/data/2.5/find",
		dataType : "jsonp",
		data : {
			q : $("#event-location").val(),
			mode : "json"
		},
		success : function(data) {
			// Fix for IE 8 as forEach function not supported yet below
			// IE 9
			if (typeof Array.prototype.forEach != 'function') {
				Array.prototype.forEach = function(callback) {
					for (var i = 0; i < this.length; i++) {
						callback.apply(this, [ this[i], i, this ]);
					}
				};
			}
			
			$('#select-location').find('option').remove().end();

			var parsed = data.list;
			var newArray = new Array(parsed.length);
			var i = 0;
			parsed.forEach(function(entry) {
				var newObject = {
					label : entry.name + " - " + entry.sys.country
				};
				newArray[i] = newObject;
				
				if(i) $('.select-location').append('<option value="'+newArray[i].label+'">'+newArray[i].label+'</option>').val(newArray[i].label);
				else $('.select-location').append('<option value="'+newArray[i].label+'">'+newArray[i].label+'</option>').val(newArray[i].label).prop('selected', true);
				
				i++;
			});
		},
		error : function(message) {
		}
	});
}